<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
		<meta name="HandheldFriendly" content="true"/>
		<meta name="MobileOptimized" content="320"/>
		<title>Hello H5+</title>
		<script type="text/javascript">
// 空函数
function shield(){
	return false;
}
//取消浏览器的所有事件，使得active的样式在手机上正常生效
document.addEventListener('touchstart',shield,false);
document.oncontextmenu=shield;
// H5 plus事件处理
var ws=null,wc=null,as='slide-in-right';
var aw=false,ac=null;//加载文档内容子窗口
function plusReady(){
	// 获取自身窗口
	ws=plus.webview.currentWebview();
	ws.addEventListener('hide',function(){
		nvtt.innerText='';
		wc.clear();
		wc.hide();
	},false);
	// Android处理返回键
	plus.key.addEventListener('backbutton',function(){
		back();
	},false);
	// iOS平台使用新动画
	if('iOS'==plus.os.name){
		as='pop-in';
	}
	// 检测是否需要自动显示
	aw&&ws.show(as);
	aw=false;
	// 创建加载内容窗口
	var topoffset='45px';
	if(plus.navigator.isImmersedStatusbar()){// 兼容immersed状态栏模式
		topoffset=(Math.round(plus.navigator.getStatusbarHeight())+45)+'px';
	}
	wc=plus.webview.create(null,'doccontent',{top:topoffset,bottom:'0px',bounce:'vertical',bounceBackground:'#FFFFFF'});
	// 内容更新后自动显示
	wc.addEventListener('loaded',function(){
		wc.show('fade-in');
	},false);
	wc.hide();
	ws.append(wc);
	// 检测是否需要自动加载内容
	ac&&wc.loadURL(ac);
	ac=null;
}
if(window.plus){
	plusReady();
}else{
	document.addEventListener('plusready',plusReady,false);
}
// 处理返回事件
function back(){
	if(ws){
		if(ws.preate){
			ws.hide('auto');
		}else{
			ws.close('auto');
		}
	}else if(history.length>1){
		history.back();
	}else{
		close();
	}
}
// 更新标题和内容
function updateDoc(t,c){
	nvtt.innerText=t;
	if(ws){
		ws.show(as,null,function(){
			if(!wc){
				ac=c;
			}else{
				wc.loadURL(c);
			}
		});
	}else{
		aw=true;
		ac=c;
	}
}
		</script>
		<style type="text/css">
* {
	-webkit-user-select: none;
	-ms-touch-select: none;
}
html {
	width: 100%;
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
    color:#666;
    background-color:#EAEAEA;
    font-family: Verdana, Arial, Helvetica , "Microsoft YaHei" , sans-serif;
    font-size:14px;
    word-break: break-all;
	-webkit-touch-callout:none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-text-size-adjust:none;
}
header {
	width: 100%;
	height: 44px;
	font-size: 17px;
	text-align: center;
	line-height: 44px;
	background: rgba(215,75,40,1);
	border-bottom: 1px solid rgba(215,75,40,0.8);
	-ms-touch-action: none;
}
.nvbt {
	width: 15%;
	height: 100%;
	float: left;
}
.nvbt:active {
	background-color: rgba(170,170,170,0.1);
}
#nvtt {
	width:70%;
	height:100%;
	color: #cccccc;
	float:left;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.iback {
	background: no-repeat center center url();
	background-size: 50px 44px;
}
		</style>
	</head>
	<body onselectstart="return false;">
		<header id="header">
			<div class="nvbt iback" onclick="back()"></div>
			<div id="nvtt"></div>
		</header>
		<br/><br/><br/><br/>
		<p style="text-align:center;color:#666">正在加载中...</p>
	</body>
	<script type="text/javascript" src="../js/immersed.js" ></script>
</html>
